<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title> Vending machines </title>
  <link href="css/layout_2col_right_13.css" rel="stylesheet" type="text/css"/>
  <script type="text/javascript" src="js/addevent.js"></script>
  <script type="text/javascript" src="js/generalslide.js"></script>
  <script type="text/javascript" src="js/slide2.js"></script>
  <script type="text/javascript" src="js/slide3.js"></script>
  <script type="text/javascript" src="js/generaltabs.js"></script>
 </head>

 <body>
	<div class="page_margins">
		<div class="page">
			<div id="header">
				<h1>My useful unit-01</h1>
			</div>
			<div id="main">
				<div id="col1" role="main">
					<div id="col1_content" class="clearfix">
						<h3>幻灯片</h3>
						<div class="subcolumns">
							<div id="photoframe" class="photoframe">
								<ol style="position:absolute;top:-348px;">
									<li>
										<a href="#1" target="_blank">
											<img src="img/1.jpg">
										</a>
									</li>
									<li>
										<a href="#2" target="_blank">
											<img src="img/2.jpg">
										</a>
									</li>
									<li>
										<a href="#3" target="_blank">
											<img src="img/3.jpg">
										</a>
									</li>
								</ol>
								<ul>
									<li class="current"><a href="http://www.google.com"></a></li>
									<li><a href="#-2"></a></li>
									<li><a href="#-3"></a></li>
								</ul>
							</div>
						</div>
						<h3>幻灯片2</h3>
						<div class="subcolumns">
							<div class="coin-slider" id="coin-slider-games">
								<div id="games">
									<ol id="gamesbg">
										<li>
											<a href="http://www.minininjas.com/" target="_blank">
												<img src="img/mini_ninjas.jpg" alt="Mini Ninjas">
											</a>
										</li>
										<li>
											<a href="http://www.princeofpersiagame.com/" target="_blank">
												<img src="img/prince_of_persia.jpg" alt="Price of Persia">
											</a>
										</li>
										<li>
											<a href="http://spidermandimensions.marvel.com/" target="_blank">
												<img src="img/spiderman_shattered_dimensions.jpg" alt="Spiderman: Shattered Dimensions">
											</a>
										</li>
										<li>
											<a href="http://brinkthegame.com/" target="_blank">
												<img src="img/brink.jpg" alt="Brink">
											</a>
										</li>
										<li>
											<a href="http://www.godofwar.com/" target="_blank">
												<img src="img/god_of_war_3.jpg" alt="God of War III">
											</a>
										</li>
										<li>
											<a href="http://www.borderlandsthegame.com/" target="_blank">
												<img src="img/borderlands.jpg" alt="Borderlands">
											</a>
										</li>
										<li>
											<a href="http://www.swtor.com/" target="_blank">
												<img src="img/star_wars_the_old_republic.jpg" alt="Star Wars: The Old Republic">
											</a>
										</li>
										<li>
											<a href="http://www.batmanarkhamasylum.com/" target="_blank">
												<img src="img/batman_arkham_asylum.jpg" alt="Batman: Arkham Asylum">
											</a>
										</li>
									</ol>
								</div>
								<div id="grid"></div>
							</div>
						</div>
						<script type="text/javascript">
							slide2();
						</script>
						<h3>幻灯片3</h3>
						<div class="subcolumns">
							<div class="coin-slider" id="coin-slider-games3">
								<div id="games3">
									<ol id="gamesbg3">
										<li>
										<a href="http://www.minininjas.com/" target="_blank">
											<img src="img/mini_ninjas.jpg" alt="Mini Ninjas">
										</a>
										</li>
										<li>
										<a href="http://www.princeofpersiagame.com/" target="_blank">
											<img src="img/prince_of_persia.jpg" alt="Price of Persia">
										</a>
										</li>
										<li>
										<a href="http://spidermandimensions.marvel.com/" target="_blank">
											<img src="img/spiderman_shattered_dimensions.jpg" alt="Spiderman: Shattered Dimensions">
										</a>
										</li>
										<li>
										<a href="http://brinkthegame.com/" target="_blank">
											<img src="img/brink.jpg" alt="Brink">
										</a>
										</li>
										<li>
										<a href="http://www.godofwar.com/" target="_blank">
											<img src="img/god_of_war_3.jpg" alt="God of War III">
										</a>
										</li>
										<li>
										<a href="http://www.borderlandsthegame.com/" target="_blank">
											<img src="img/borderlands.jpg" alt="Borderlands">
										</a>
										</li>
										<li>
										<a href="http://www.swtor.com/" target="_blank">
											<img src="img/star_wars_the_old_republic.jpg" alt="Star Wars: The Old Republic">
										</a>
										</li>
										<li>
										<a href="http://www.batmanarkhamasylum.com/" target="_blank">
											<img src="img/batman_arkham_asylum.jpg" alt="Batman: Arkham Asylum">
										</a>
										</li>
									</ol>
								</div>
								<div id="grid3"></div>
								<ul>
									<li class="current"><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
									<li><a href="#"></a></li>
								</ul>
							</div>
						</div>
						<script type="text/javascript">
							slide3();
						</script>
						<h3>滑动门</h3>
						<div class="subcolumns">
							<div class="domtab">
								<ul id="gtags">
									<li class="active"><a href="#what">Sport体育</a></li>
									<li><a href="#how">NBA美国</a></li>
									<li><a href="#pr">CBA中国</a></li>
									<li><a href="#style">国际足球Football</a></li>
								</ul>
								<div id="gtcontent" class="content">
									<div class="on">
										Test<br>
										Test<br>
										Test<br>
										Test<br>
										Test<br>
										Test<br>
									</div>
									<div>
										Second<br>
										Second<br>
										Second<br>
										Second<br>
										Second<br>
										Second<br>
									</div>
									<div>
										Third<br>
										Third<br>
										Third<br>
										Third<br>
										Third<br>
										Third<br>
									</div>
									<div>
										fourth<br>
										fourth<br>
										fourth<br>
										fourth<br>
										fourth<br>
										fourth<br>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div id="col3">
					<div id="col3_content">
						<ul>
							<li>China</li>
							<li>US</li>
							<li>UN</li>
							<li>AS</li>
							<li>CS</li>
						</ul>
					</div>
				</div>
			</div>
			<div id="footer">
				Li Pengyu 2010.10
			</div>
		</div>
	</div>
	<script>
		var ptag = document.getElementById('gtags'),
    		pcnt = document.getElementById('gtcontent'),
			numb = 4;
		tabscommon(ptag, pcnt, numb);
		
		var pf = document.getElementById('photoframe'),
			ol = pf.getElementsByTagName('ol')[0],
			ul = pf.getElementsByTagName('ul')[0],
			li = ul.getElementsByTagName('li');
		sloo(ol,li);
	</script>
 </body>
</html>
